<!doctype html>
<html>
    <head>
		<style>
		body {
		  font-family:Arial,'DejaVu Sans','Liberation Sans',Freesans,sans-serif;
		}
	
		
		</style>
		<link rel="stylesheet" type="text/css" href="css/table.css" />
		<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.6.3/jquery.min.js" type="text/javascript"></script>
		<script src="jquery.dataTables.min.js"></script>
        <script>
		
            (function(dt) {

				dt.resources.onFinished.addListener(function(resource) {									

					var via = '';					
					for (var i = 0; i < resource.response.headers.length; i++) { 						
						if(resource.response.headers[i].name == 'Via'){
							via = resource.response.headers[i].value;
						}						
					}

					var isodate = ISODateString(new Date());
					var url = resource.request.url;
					if(url.length > 25) {
						shorturl = url.substring(0,24)+"...";
					}
					var urlitem = '<a href="'+url+'" class="tooltip" title="'+url+'" >'+shorturl+'</a>';
									
					var viaCode = extractViaCodes(via);
					
					$('#datatable').dataTable().fnAddData( [
						isodate,
						urlitem,
						getProxyName(via),
						getCacheLookupDescription(viaCode), 
						getServerInfoDescription(viaCode), 
						getCacheFillDescription(viaCode) ] );
					
					
				})	

            })(chrome.experimental.devtools);
			
			function ISODateString(d){
				function pad(n){return n<10 ? '0'+n : n}
				return d.getUTCFullYear()+'-'
						+ pad(d.getUTCMonth()+1)+'-'
						+ pad(d.getUTCDate())+'T'
						+ pad(d.getUTCHours())+':'
						+ pad(d.getUTCMinutes())+':'
						+ pad(d.getUTCSeconds())+'Z'}
			
			function getProxyName(value) {
				var arr = value.split(" ");
				arr = arr[1].split(" ");
				return arr[0];
			}
			
			function extractViaCodes(value) {
				var arr = value.split("[");
				arr = arr[1].split("]");
				return arr[0];
			}
			
			function getCodeValue(codes, codelabel) {
				codeIndex = codes.indexOf(codelabel);
				return codes.charAt(codeIndex + 1);
			}	
			
			function getCacheLookupDescription(viaCode){
			
			/*
				A	 in cache, not acceptable (a cache "MISS")
				H	 in cache, fresh (a cache "HIT")
				M	 miss (a cache "MISS")
				S	 in cache, stale (a cache "MISS")
				blank	 no cache lookup performed			
			*/
				var codeValue = getCodeValue(viaCode, 'c');
				switch(codeValue)
				{
					case 'A':
						return 'in cache, not acceptable<br/>(a cache "MISS")';
					case 'H':
						return 'in cache, fresh<br/>(a cache "HIT")';
					case 'M':
						return 'miss<br/>(a cache "MISS")';
					case 'S':
						return 'in cache, stale<br/>(a cache "MISS")';
					case ' ':
						return 'no cache lookup performed';
				}
				
				return codeValue + '?';
			}
			
			function getServerInfoDescription(viaCode){
			
			/*
				E	 error in response
				N	 not-modified
				S	 served
				blank	 no server connection needed	
			*/
				var codeValue = getCodeValue(viaCode, 's');
				switch(codeValue)
				{
					case 'E':
						return 'error in response';
					case 'N':
						return 'not-modified';
					case 'S':
						return 'served';
					case ' ':
						return 'no server connection needed';
				}
				
				return codeValue + '?';
			}

			function getCacheFillDescription(viaCode){
			
			/*
				D	 cached copy deleted
				U	 updated old cache copy
				W	 written into cache (new copy)
				blank	 no cache write performed
			*/
				var codeValue = getCodeValue(viaCode, 'f');
				switch(codeValue)
				{
					case 'D':
						return 'cached copy deleted';
					case 'U':
						return 'updated old cache copy';
					case 'W':
						return 'written into cache (new copy)';
					case ' ':
						return 'no cache write performed';
				}
				
				return codeValue + '?';
			}
			
        </script>
		<script>		
			$(document).ready(function() {

				$('#datatable').dataTable({
					"bAutoWidth": false
				});
			

				
		
				
			


} );			
		</script>
    </head>
    <body>
		<div>
		<table cellpadding="0" cellspacing="0" border="0" class="display" id="datatable">
			<thead>
				<tr>
					<th>Datetime</th>
					<th>Url</th>
					<th>Via</th>
					<th>cache-lookup</th>
					<th>server-info</th>					
					<th>cache-fill</th>
				</tr>
			</thead>
			<tbody>
			<tbody>
		</table>
		</div>
    </body>
</html>
